<template>
  <div class="goods_sku_config">
    <el-container>
      <el-header>
        <header-item :item="tips"></header-item>
      </el-header>
      <el-main>
        <main-tools-item :toolsType="toolsType" :searchType="searchType" :inputValue="inputValue" @search='search' @add='add'></main-tools-item>
        <main-spare-item @onClick=''></main-spare-item>
        <main-data-list-item :columns="columns" :dataList="dataList" :pager="page" @batchDelete='batchDelete' @currentChange='currentChange'>
          <el-table-column label="操作" slot="table_oper" min-width="160px">
            <template slot-scope="scope">
              <el-button size="mini" type="success" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
              <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </main-data-list-item>
      </el-main>
    </el-container>
    <!--新增弹框 -->
    <el-dialog title="新增" :visible.sync="addDialogVisible" :before-close="addBeforeClose" close-on-press-escape close-on-click-modal
      class="defaultDialog" :modal="false">
      <el-form ref="addParam" :rules="addAndEditRules" :model="addParam" label-width="30%">
        <el-form-item label="商品">
          <el-cascader v-model="addParam.gid" :options="gidOptions" @change="addGidTypeSelect" :show-all-levels="false" :props="{}"
            style="" />
        </el-form-item>
        <template v-if="skuShow" v-for="(item, index) in addAndEditColumns">
          <el-form-item :label="item.label" :key="index">
            <el-radio-group v-model="addAndEditCheckboxParam[index]" @change="addCheckboxChange">
              <template v-for="(child, childIndex) in item.children">
                <el-radio :label="child.value" name="type" :key="childIndex">{{child.label}}</el-radio>
              </template>
            </el-radio-group>
          </el-form-item>
        </template>
        <el-form-item label="商品区域类型">
          <el-select v-model="addParam.type" placeholder="请选择">
            <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="商品分类">
          <el-select v-model="addParam.category" placeholder="请选择">
            <el-option v-for="item in categoryOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="图标">
          <el-upload class="upload-demo" :action="uploadUrl" :on-remove="addIconHandleRemove" :on-success="addIconHandleSuccess" :file-list="addIconFileList"
            list-type="picture" name="file" :headers="uploadHeaders" :limit="1">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
          </el-upload>
        </el-form-item>
        <el-form-item label="备注信息">
          <el-input v-model="addParam.remark"></el-input>
        </el-form-item>
        <el-form-item label="门市价格">
          <el-input v-model="addParam.initPrice"></el-input>
        </el-form-item>
        <el-form-item label="活动价格">
          <el-input v-model="addParam.actPrice"></el-input>
        </el-form-item>
        <el-form-item label="积分兑换数" v-if="addParam.category == 3">
          <el-input v-model="addParam.point"></el-input>
        </el-form-item>
        <el-form-item label="限购人数" v-if="addParam.category == 2">
          <el-input v-model="addParam.limitNum"></el-input>
        </el-form-item>
        <el-form-item label="团购人数" v-if="addParam.category == 1">
          <el-input v-model="addParam.groupBuyNum"></el-input>
        </el-form-item>
        <el-form-item label="库存数">
          <el-input v-model="addParam.stockNum"></el-input>
        </el-form-item>
        <el-form-item label="出售数">
          <el-input v-model="addParam.sellNum"></el-input>
        </el-form-item>
        <el-form-item label="SVIP1优惠金额">
          <el-input v-model="addParam.svip1Discount"></el-input>
        </el-form-item>
        <el-form-item label="SVIP2优惠金额">
          <el-input v-model="addParam.svip2Discount"></el-input>
        </el-form-item>
        <el-form-item label="SVIP3优惠金额">
          <el-input v-model="addParam.svip3Discount"></el-input>
        </el-form-item>
        <el-form-item label="SVIP4优惠金额">
          <el-input v-model="addParam.svip4Discount"></el-input>
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="addParam.status" placeholder="请选择">
            <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="排序">
          <el-input v-model="addParam.orderNum"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" @click="addSumbit">提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    <!--编辑弹框 -->
    <el-dialog title="编辑" :visible.sync="editDialogVisible" :before-close="editBeforeClose" close-on-press-escape close-on-click-modal
      class="defaultDialog" :modal="false">
      <el-form ref="editParam" :rules="addAndEditRules" :model="editParam" label-width="30%">
        <el-form-item label="商品">
          <el-cascader v-model="editParam.gid" :options="gidOptions" @change="editGidTypeSelect" :show-all-levels="false" :props="{}"
            style="" />
        </el-form-item>
        <template v-if="skuShow" v-for="(item, index) in addAndEditColumns">
          <el-form-item :label="item.label" :key="index">
            <el-radio-group v-model="addAndEditCheckboxParam[index]" @change="editCheckboxChange">
              <template v-for="(child, index) in item.children">
                <el-radio :label="child.value" name="type" :key="index">{{child.label}}</el-radio>
              </template>
            </el-radio-group>
          </el-form-item>
        </template>
        <el-form-item label="商品区域类型">
          <el-select v-model="editParam.type" placeholder="请选择">
            <el-option v-for="item in typeOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="商品分类">
          <el-select v-model="editParam.category" placeholder="请选择">
            <el-option v-for="item in categoryOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="图标">
          <el-upload class="upload-demo" :action="uploadUrl" :on-remove="editIconHandleRemove" :on-success="editIconHandleSuccess"
            :file-list="editIconFileList" list-type="picture" name="file" :headers="uploadHeaders" :limit="1">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
          </el-upload>
        </el-form-item>
        <el-form-item label="备注信息">
          <el-input v-model="editParam.remark"></el-input>
        </el-form-item>
        <el-form-item label="门市价格">
          <el-input v-model="editParam.initPrice"></el-input>
        </el-form-item>
        <el-form-item label="活动价格">
          <el-input v-model="editParam.actPrice"></el-input>
        </el-form-item>
        <el-form-item label="积分兑换数" v-if="editParam.category == 3">
          <el-input v-model="editParam.point"></el-input>
        </el-form-item>
        <el-form-item label="限购人数" v-if="editParam.category == 2">
          <el-input v-model="editParam.limitNum"></el-input>
        </el-form-item>
        <el-form-item label="团购人数" v-if="editParam.category == 1">
          <el-input v-model="editParam.groupBuyNum"></el-input>
        </el-form-item>
        <el-form-item label="库存数">
          <el-input v-model="editParam.stockNum"></el-input>
        </el-form-item>
        <el-form-item label="出售数">
          <el-input v-model="editParam.sellNum"></el-input>
        </el-form-item>
        <el-form-item label="SVIP1优惠金额">
          <el-input v-model="editParam.svip1Discount"></el-input>
        </el-form-item>
        <el-form-item label="SVIP2优惠金额">
          <el-input v-model="editParam.svip2Discount"></el-input>
        </el-form-item>
        <el-form-item label="SVIP3优惠金额">
          <el-input v-model="editParam.svip3Discount"></el-input>
        </el-form-item>
        <el-form-item label="SVIP4优惠金额">
          <el-input v-model="editParam.svip4Discount"></el-input>
        </el-form-item>
        <el-form-item label="状态">
          <el-select v-model="editParam.status" placeholder="请选择">
            <el-option v-for="item in statusOptions" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="排序">
          <el-input v-model="editParam.orderNum"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" @click="editSumbit">提交</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import {
    get,
    post,
    pat,
    del,
    common,
    getRefresh
  } from "../../../../api/api";
  import headerItem from "./../../Commons/headerItem.vue";
  import mainToolsItem from "./../../Commons/mainToolsItem.vue";
  import mainSpareItem from "./../../Commons/mainSpareItem.vue";
  import mainDataListItem from "./../../Commons/mainDataListItem.vue";
  import config from "../../../../../static/config.js";
  export default {
    components: {
      headerItem,
      mainToolsItem,
      mainSpareItem,
      mainDataListItem,
      UE: () =>
        import ('../ue.vue')
    },
    data() {
      return {
        tips: "商品SKU",
        uploadUrl: window.dict.url + "/goods/upFilePic",
        toolsType: 1,
        searchType: 5,
        inputValue: '请输入SKU名称',
        sels: [],
        skuShow: false,
        skuValue: [],
        gidOrigin: "",
        page: {
          pageNo: 1,
          limit: 10,
          sizes: [10, 50, 100],
          total: 0
        },
        columns: [{
            prop: 'id',
            label: '商品SKU配置id',
            width: '140px',
            align: 'center'
          },
          // {
          //   prop: 'gid',
          //   label: '商品id',
          //   width: '',
          //   align: 'center',
          // },
          {
            prop: 'xasSkuGoodsListName',
            label: '商品名称',
            width: '320px',
            align: 'center',
          },
          {
            prop: 'type',
            label: '商品区域类型',
            width: '120px',
            align: 'center'
          },
          {
            prop: 'category',
            label: '商品分类',
            width: '100px',
            align: 'center'
          },
          // {
          //   prop: 'sku',
          //   label: '商品SKU',
          //   width: '',
          //   align: 'center'
          // },
          {
            prop: 'skuStr',
            label: '商品SKU',
            width: '160px',
            align: 'center'
          },
          {
            prop: 'icon',
            label: '图标',
            width: '80px',
            align: 'center'
          }, {
            prop: 'remark',
            label: '备注信息',
            width: '200px',
            align: 'center'
          }, {
            prop: 'initPrice',
            label: '门市价格',
            width: '100px',
            align: 'center'
          }, {
            prop: 'actPrice',
            label: '活动价格',
            width: '100px',
            align: 'center'
          }, {
            prop: 'point',
            label: '积分兑换数',
            width: '120px',
            align: 'center'
          }, {
            prop: 'limitNum',
            label: '限购人数',
            width: '100px',
            align: 'center'
          }, {
            prop: 'groupBuyNum',
            label: '团购人数',
            width: '100px',
            align: 'center'
          }, {
            prop: 'stockNum',
            label: '库存数',
            width: '100px',
            align: 'center'
          }, {
            prop: 'sellNum',
            label: '出售数',
            width: '100px',
            align: 'center'
          }, {
            prop: 'lockNum',
            label: '锁定商品数量',
            width: '120px',
            align: 'center'
          },
          {
            prop: 'svip1Discount',
            label: 'SVIP1优惠金额',
            width: '140px',
            align: 'center'
          },
          {
            prop: 'svip2Discount',
            label: 'SVIP2优惠金额',
            width: '140px',
            align: 'center'
          },
          {
            prop: 'svip3Discount',
            label: 'SVIP3优惠金额',
            width: '140px',
            align: 'center'
          },
          {
            prop: 'svip4Discount',
            label: 'SVIP4优惠金额',
            width: '140px',
            align: 'center'
          },
          {
            prop: 'status',
            label: '状态',
            width: '',
            align: 'center'
          }, {
            prop: 'orderNum',
            label: '排序',
            width: '',
            align: 'center'
          }, {
            prop: 'createUser',
            label: '创建者',
            width: '',
            align: 'center'
          },
          {
            prop: 'createTime',
            label: '创建时间',
            width: '',
            align: 'center'
          }
        ],
        dataList: [],
        loading: false,
        param: {
          name: '',
          size: '10',
          current: '1'
        },
        addParam: {
          gid: "",
          sku: "",
          status: 1,
          type: 1,
          category: 0
        },
        addAndEditColumns: [],
        addAndEditCheckboxParam: [],
        gidOptions: [],
        editParam: {},
        statusOptions: [{
          label: "不可用",
          value: 0
        }, {
          label: "可用",
          value: 1
        }],
        typeOptions: [{
          label: "国内",
          value: 1
        }, {
          label: "保税区直供",
          value: 2
        }, {
          label: "海外直邮",
          value: 3
        }, {
          label: "香港直邮",
          value: 4
        }],
        categoryOptions: [{
          label: "普通商品",
          value: 0
        }, {
          label: "团购商品",
          value: 1
        }, {
          label: "限购商品",
          value: 2
        }, {
          label: "积分商品",
          value: 3
        }],
        addAndEditRules: {
          id: [{
              required: true,
              message: '请输入内容',
              trigger: 'blur'
            },
            // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
          ],
          gid: [{
            required: true,
            message: '请输入内容',
            trigger: 'blur'
          }],
          type: [{
            required: true,
            message: '请输入内容',
            trigger: 'blur'
          }],
          category: [{
            required: true,
            message: '请输入内容',
            trigger: 'blur'
          }],
          sku: [{
            required: true,
            message: '请输入内容',
            trigger: 'blur'
          }]
        },
        addDialogVisible: false,
        editDialogVisible: false,
        addIconFileList: [],
        editIconFileList: [],
        uploadHeaders: {
          'token': localStorage.getItem('token')
        }
      };
    },
    methods: {
      //--------查询----------
      search(val) {
        this.param = {}
        this.param.name = "";
        this.param.name = val.name;
        this.getGoodsSkuConfig();
      },
      //--------新增----------
      addBeforeClose(done) {
        if (this.addParam.gid == null) {
          this.skuShow = false;
        }
        this.addIconFileList = [];
        done()
      },
      add() {
        this.addDialogVisible = true;
        this.addParam = {
          'status': 1
        }
        this.skuShow = false;
        this.getGoodsList();
      },
      addSumbit() {
        if (this.addParam.sku != null && this.addParam.sku != "") {
          var addAndEditCheckboxParamIsNull = false;
          for (var item in this.addAndEditCheckboxParam) {
            if (this.addAndEditCheckboxParam[item].length == 0) {
              addAndEditCheckboxParamIsNull = true
            }
          }
          if (addAndEditCheckboxParamIsNull) {
            this.$message({
              type: 'error',
              showClose: true,
              duration: 5000,
              message: '各项商品属性必选!'
            });
          } else {
            if (this.addParam.category == 1 && this.addParam.groupBuyNum > 0) {
              this.addDialogVisible = false;
              this.addIconFileList = [];
              this.addGoodsSkuConfig();
            } else if (this.addParam.category == 2 && this.addParam.limitNum > 0) {
              this.addDialogVisible = false;
              this.addIconFileList = [];
              this.addGoodsSkuConfig();
            } else if (this.addParam.category == 3 && this.addParam.point > 0) {
              this.addDialogVisible = false;
              this.addIconFileList = [];
              this.addGoodsSkuConfig();
            } else if (this.addParam.category == 0) {
              this.addDialogVisible = false;
              this.addIconFileList = [];
              this.addGoodsSkuConfig();
            } else {
              this.$message({
                type: 'error',
                showClose: true,
                duration: 5000,
                message: '所选商品分类的对应人数或对应兑换数不能为0!'
              });
            }
          }
        } else {
          this.$message({
            type: 'error',
            showClose: true,
            duration: 5000,
            message: '所选商品未配置商品属性!'
          });
        }
      },
      addIconHandleRemove() {
        this.addParam.icon = " "
      },
      addIconHandleSuccess(response, file, fileList) {
        this.addParam.icon = response.data
      },
      addGidTypeSelect(val) {
        if (val) {
          this.getGoodsSkuPropConfigList(val[val.length - 1]);
        }
      },
      addCheckboxChange(value) {
        this.addParam.sku = ""
        for (var i = 0; i < this.addAndEditCheckboxParam.length; i++) {
          if (i == this.addAndEditCheckboxParam.length - 1) {
            this.addParam.sku += '[' + this.addAndEditCheckboxParam[i] + ']'
          } else {
            this.addParam.sku += '[' + this.addAndEditCheckboxParam[i] + '],'
          }
        }
        // this.addParam.sku = this.addCheckboxParam.toString();
      },
      //--------编辑----------
      editBeforeClose(done) {
        this.skuShow = false;
        this.editIconFileList = [];
        done()
      },
      handleEdit(index, row) {
        this.editDialogVisible = true;
        this.skuShow = true;
        this.gidOrigin = row.gid;
        this.skuValue = row.sku.split(",");
        this.getGoodsList();
        this.getGoodsSkuPropConfigListByEdit(row.gid, row.sku.split(","));
        this.editParam = JSON.parse(JSON.stringify(row));
        this.getSingleGoodsList(row.gid);
        // this.editParam.gid=[1,3,5,1]
        if (row.icon && row.icon != " ") {
          this.editIconFileList = [{
            name: row.name,
            url: row.icon
          }]
        }
      },
      editSumbit() {
        if (this.editParam.category == 1 && this.editParam.groupBuyNum > 0) {
          this.editDialogVisible = false;
          this.editGoodsSkuConfig();
        } else if (this.editParam.category == 2 && this.editParam.limitNum > 0) {
          this.editDialogVisible = false;
          this.editGoodsSkuConfig();
        } else if (this.editParam.category == 3 && this.editParam.point > 0) {
          this.editDialogVisible = false;
          this.editGoodsSkuConfig();
        } else if (this.editParam.category == 0) {
          this.editDialogVisible = false;
          this.editGoodsSkuConfig();
        } else {
          alert("所选商品分类的对应人数或对应兑换数不能为0!")
        }
      },
      editIconHandleRemove() {
        this.editParam.icon = " "
      },
      editIconHandleSuccess(response, file, fileList) {
        this.editParam.icon = response.data
      },
      editGidTypeSelect(val) {
        // this.addParam.gid = val[val.length - 1];
        if (val[val.length - 1] == this.gidOrigin) {
          this.getGoodsSkuPropConfigListByEdit(val[val.length - 1], this.skuValue);
        } else {
          this.getGoodsSkuPropConfigList(val[val.length - 1]);
        }
      },
      editCheckboxChange(value) {
        this.editParam.sku = ""
        for (var i = 0; i < this.addAndEditCheckboxParam.length; i++) {
          if (i == this.addAndEditCheckboxParam.length - 1) {
            this.editParam.sku += '[' + this.addAndEditCheckboxParam[i] + ']'
          } else {
            this.editParam.sku += '[' + this.addAndEditCheckboxParam[i] + '],'
          }
        }
      },
      //--------删除----------
      handleDelete(index, row) {
        this.delConfirm(row.id);
      },
      batchDelete(val) {},
      //-------分页----------
      currentChange(val) {
        this.param.current = "";
        this.param.current = val
        this.getGoodsSkuConfig();
      },
      //获取list列表
      getGoodsSkuConfig() {
        return new Promise((resolve, reject) => {
          var param = {};
          for (let key in this.param) {
            if (this.param[key] != null && this.param[key].length != 0) {
              param[key] = this.param[key]
            }
          }
          post("/goods/selectXasGoodsSkuConfig", param).then(resdata => {
            let self = function () {
              this.$router.push({
                path: '/home'
              });
            }.bind(this);
            let error = function () {
              alert(resdata.msg)
            }.bind(this);
            let success = function () {
              if (resdata.code == 1) {
                this.dataList = resdata.data.records;
                this.page.total = resdata.data.total;
              }
            }.bind(this);
            common(self)(error)(success)(resdata);
            resolve();
          });
        });
      },
      //获取Goods列表
      getGoodsList() {
        return new Promise((resolve, reject) => {
          post("/goods/selectAllXasGoodsList").then(resdata => {
            let self = function () {
              this.$router.push({
                path: '/home'
              });
            }.bind(this);
            let error = function () {
              alert(resdata.msg)
            }.bind(this);
            let success = function () {
              if (resdata.code == 1) {
                var list = resdata.data;
                var newList = [];
                const getStr = function (list, newList) {
                  for (var i = 0; i < list.length; i++) {
                    var midList = {};
                    midList.value = list[i].id;
                    midList.label = list[i].name;
                    if (list[i].goodsCategoryList) {
                      midList.children = [];
                      newList[i] = midList;
                      getStr(list[i].goodsCategoryList, newList[i].children)
                    }
                    if (list[i].xasGoodsList) {
                      midList.children = [];
                      newList[i] = midList;
                      getStr(list[i].xasGoodsList, newList[i].children)
                    }
                    newList[i] = midList;
                  }
                }
                getStr(list, newList)
                this.gidOptions = newList;
              }
            }.bind(this);
            common(self)(error)(success)(resdata);
            resolve();
          });
        });
      },
      getSingleGoodsList(id) {
        return new Promise((resolve, reject) => {
          var param = {
            size: '10',
            current: '1',
            id: id,
          };
          post("/goods/selectXasGoodsListById", param).then(resdata => {
            let self = function () {
              this.$router.push({
                path: '/home'
              });
            }.bind(this);
            let error = function () {
              alert(resdata.msg)
            }.bind(this);
            let success = function () {
              if (resdata.code == 1) {
                var data = resdata.data;
                this.editParam.gid = [];
                this.editParam.gid.push(data.topId);
                this.editParam.gid.push(data.ppid);
                this.editParam.gid.push(data.pid);
                this.editParam.gid.push(data.id);
              }
            }.bind(this);
            common(self)(error)(success)(resdata);
            resolve();
          });
        });
      },
      //获取GoodsSkuPropConfig列表
      getGoodsSkuPropConfigList(id) {
        return new Promise((resolve, reject) => {
          post("/goods/selectXasGoodsSkuPropConfig", {
            "id": id
          }).then(resdata => {
            let self = function () {
              this.$router.push({
                path: '/home'
              });
            }.bind(this);
            let error = function () {
              alert(resdata.msg)
            }.bind(this);
            let success = function () {
              if (resdata.code == 1) {
                this.addAndEditColumns = [];
                for (var i = 0; i < resdata.data.length; i++) {
                  var midList = {};
                  midList.value = resdata.data[i].id;
                  midList.label = resdata.data[i].name;
                  if (resdata.data[i].xasGoodsPropValueLists) {
                    midList.children = [];
                    for (var j = 0; j < resdata.data[i].xasGoodsPropValueLists.length; j++) {
                      var thrList = {};
                      thrList.value = resdata.data[i].xasGoodsPropValueLists[j].id;
                      thrList.label = resdata.data[i].xasGoodsPropValueLists[j].value;
                      midList.children.push(thrList)
                    }
                  }
                  this.addAndEditColumns.push(midList);
                }
                for (var k = 0; k < this.addAndEditColumns.length; k++) {
                  this.addAndEditCheckboxParam[k] = [];
                }
                this.skuShow = true;
              }
            }.bind(this);
            common(self)(error)(success)(resdata);
            resolve();
          });
        });
      },
      getGoodsSkuPropConfigListByEdit(id, sku_list) {
        return new Promise((resolve, reject) => {
          post("/goods/selectXasGoodsSkuPropConfig", {
            "id": id
          }).then(resdata => {
            let self = function () {
              this.$router.push({
                path: '/home'
              });
            }.bind(this);
            let error = function () {
              alert(resdata.msg)
            }.bind(this);
            let success = function () {
              if (resdata.code == 1) {
                this.addAndEditColumns = [];
                for (var i = 0; i < resdata.data.length; i++) {
                  var midList = {};
                  midList.value = resdata.data[i].id;
                  midList.label = resdata.data[i].name;
                  if (resdata.data[i].xasGoodsPropValueLists) {
                    midList.children = [];
                    for (var j = 0; j < resdata.data[i].xasGoodsPropValueLists.length; j++) {
                      var thrList = {};
                      thrList.value = resdata.data[i].xasGoodsPropValueLists[j].id;
                      thrList.label = resdata.data[i].xasGoodsPropValueLists[j].value;
                      midList.children.push(thrList)
                    }
                  }
                  this.addAndEditColumns.push(midList);
                }
                this.addAndEditCheckboxParam = [];
                for (let i = 0; i < sku_list.length; i++) {
                  sku_list[i] = sku_list[i].replace("[", "");
                  sku_list[i] = sku_list[i].replace("]", "");
                  this.addAndEditCheckboxParam.push(Number(sku_list[i]));
                }
                this.skuShow = true;
              }
            }.bind(this);
            common(self)(error)(success)(resdata);
            resolve();
          });
        });
      },
      addGoodsSkuConfig() {
        return new Promise((resolve, reject) => {
          var addParam = {};
          for (let key in this.addParam) {
            if (this.addParam[key] != null && this.addParam[key].length != 0) {
              addParam[key] = this.addParam[key]
            }
            if (key == "gid") {
              addParam[key] = this.addParam[key][this.addParam[key].length - 1]
            }
          }
          post("/goods/addXasGoodsSkuConfig", addParam).then(resdata => {
              let self = function () {
                this.$router.push({
                  path: '/home'
                });
              }.bind(this);
              let error = function () {
                alert(resdata.msg)
              }.bind(this);
              let success = function () {
                if (resdata.code == 1) {
                  this.$message({
                    message: '新增成功！',
                    type: 'success',
                    duration: 2000,
                  });
                  this.getGoodsSkuConfig();
                }
              }.bind(this);
              common(self)(error)(success)(resdata);
              resolve();
            })
            .catch(e => {
              this.$message({
                message: e,
                type: "error"
              });
            });
        });
      },
      editGoodsSkuConfig() {
        return new Promise((resolve, reject) => {
          var editParam = {};
          for (let key in this.editParam) {
            if (this.editParam[key] != null && this.editParam[key].length != 0) {
              editParam[key] = this.editParam[key]
            }
            if (key == "gid") {
              editParam[key] = this.editParam[key][this.editParam[key].length - 1]
            }
          }
          post("/goods/updateXasGoodsSkuConfig", editParam).then(resdata => {
              let self = function () {
                this.$router.push({
                  path: '/home'
                });
              }.bind(this);
              let error = function () {
                alert(resdata.msg)
              }.bind(this);
              let success = function () {
                if (resdata.code == 1) {
                  this.$message({
                    message: '编辑成功！',
                    type: 'success',
                    duration: 2000,
                  });
                  this.getGoodsSkuConfig();
                }
              }.bind(this);
              common(self)(error)(success)(resdata);
              resolve();
            })
            .catch(e => {
              this.$message({
                message: e,
                type: "error"
              });
            });
        });
      },
      delConfirm(id) {
        this.$confirm('确定删除, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          center: true
        }).then(() => {
          this.delGoodsSkuConfig(id);
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      delGoodsSkuConfig(id) {
        return new Promise((resolve, reject) => {
          post("/goods/delXasGoodsSkuConfig", {
            'id': id
          }).then(resdata => {
            let self = function () {
              this.$router.push({
                path: '/home'
              });
            }.bind(this);
            let error = function () {
              alert(resdata.msg)
            }.bind(this);
            let success = function () {
              if (resdata.code == 1) {
                this.$message({
                  message: '删除成功！',
                  type: 'success',
                  duration: 2000,
                });
                this.getGoodsSkuConfig();
              }
            }.bind(this);
            common(self)(error)(success)(resdata);
            resolve();
          });
        });
      }
    },
    async mounted() {
      await this.getGoodsSkuConfig();
    },
    watch: {}
  };

</script>

<style lang="scss">
  .goods_sku_config {
    background-color: white;
    font-size: 1.8rem;
    width: 100%;
    height: 100%;
    .el-container {
      height: 100%;
      .el-header,
      .el-footer {
        background-color: #F9FAFE;
        color: #333;
        text-align: center;
        line-height: 50px;
        height: 50px !important;
        .header-child {
          height: 50px;
          width: 100%;
          text-align: left;
          padding-left: 20px;
          background-color: #cbe9eb;
          border-bottom: 1px solid black;
          box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.5);
        }
      }
      .el-main {
        box-shadow: 0 5px 5px 0px rgba(0, 0, 0, 0.5); // margin: 10px 20px;
        margin: 10px;
        background-color: #fff;
        color: #333;
        text-align: center;
        height: 100%;
      }
    }
    /* 弹框CSS*/
    .defaultDialog {
      z-index: 1200 !important;
      .el-dialog {
        box-shadow: 0px 5px 15px 0 rgba(0, 0, 0, 0.5);
        border-radius: 5px;
        width: 50% !important;
        .el-dialog__header {
          text-align: left;
          .el-dialog__title {
            font-family: "Roboto", sans-serif;
            color: #7d7d7d;
            font-size: 15px;
          }
        }
        .el-dialog__body {
          .el-form {
            padding-left: 40px;
            .el-form-item {
              width: 100%;
              .el-form-item__content {
                text-align: left;
                width: 250px;
                .el-cascader {
                  width: 100%;
                }
                .el-select {
                  width: 100%;
                }
              }
              .el-form-item__label {
                padding: 0 50px 0 0;
                min-width: 80px;
                color: #333;
                font-weight: 400;
                font-size: 13px;
              }
            }
          }
        }
      }
    }
  }

</style>
